// create the context menu
    var menuItems = [
                {
                  label : 'Dependency...',
                  onclick : function(e){
                    addDependency("dependencies");
                  }
                },
                {
                  label : 'Data Source...',
                  onclick : function(e){
                    addDatasource("data");
                  }
                },
                {
                  hr : true
                },
                {
                  label : 'Export',
                  onclick : function(e){
                    $( "#div_export" ).dialog( {
                      modal : true,
                      width : 600,
                      height : 500
                    } );

                    // retrieve the strings from the editors
                    var editor = ace.edit("editor_config");
                    var configString = editor.getSession().getValue();
                    editor = ace.edit("editor_html");
                    var htmlString = editor.getSession().getValue();
                    editor = ace.edit("editor_javascript");
                    var jsString = editor.getSession().getValue();
                    editor = ace.edit("editor_css");
                    var cssString = editor.getSession().getValue();

                    // build the export object
                    var exportObject = {
                        config : configString,
                        html : htmlString,
                        js : jsString,
                        css : cssString
                    }
                    
                    // export editor
                    var editor = ace.edit("editor_export");
                    editor.getSession().setUseWrapMode(false);
                    editor.setValue( JSON.stringify(exportObject) );
                    editor.resize();
                    
                    $( "#div_export" ).dialog( "open" );
                  }
                }
              ];
    contextmenu.attach($("#editor_config"), contextmenu(menuItems));
                            
                            
                            
                            
//function to add a resource to the editor
function addDependency(configType) {

    // if the editor is empty, add the array brackets
    var newString = "";
    if (editor_config.getSession().getValue() === "") {
        newString += '{';
        newString += '\n    "' + configType + '" : [';
        newString += '\n        {';
        newString += '\n            "id" : "...",';
        newString += '\n            "url" : "..."';
        newString += '\n        }';
        newString += '\n    ]';
        newString += '\n}';
        editor_config.insert(newString);
        return;
    }

    // if the editor is not empty, try to find the array holding the configType
    editor_config.moveCursorToPosition({row: 0, column: 0});
    if (editor_config.find('"' + configType + '" : [', {backwards: false}) !== undefined) {

        // get the start position
        var cursorStart = editor_config.selection.getCursor();

        // from here, find the closing tag
        if (editor_config.find(']', {backwards: false}) !== undefined) {

            // now look backwards for the last "
            if (editor_config.find('}', {backwards: true}) !== undefined) {

                // check if the found " character belongs to either an entry or to the "dependency" property
                var cursorLastEntry = editor_config.selection.getCursor();
                if ((cursorLastEntry.row < cursorStart.row) || (cursorLastEntry.row === cursorStart.row && cursorLastEntry.column < cursorStart.column)) {
                    editor_config.moveCursorToPosition({row: 0, column: 0});
                    editor_config.find('"' + configType + '" : [', {backwards: false});
                    editor_config.insert('"' + configType + '" : [\n        {\n            "id" : "...",\n            "url" : "..."\n        }\n');
                } else {
                    editor_config.insert('},\n        {\n            "id" : "...",\n            "url" : "..."\n        }');
                }
            }
        } else {
            alert('Invalid JSON');
        }
    } else { // a new entry for the config type needs to be added

        // find the closing bracket
        editor_config.moveCursorToPosition({row: 99999, column: 1});
        if (editor_config.find("]", {backwards: true}) !== undefined) {
            editor_config.insert('],\n\n    "' + configType + '" : [\n        {\n            "id" : "...",\n             "url" : "..."\n        }\n    ]');
            return;
        }


        editor_config.moveCursorToPosition({row: 99999, column: 1});
        var lastPositionDocument = editor_config.selection.getCursor();
        if (editor_config.find("}", {backwards: true}) !== undefined) {
            editor_config.findNext(); // try to find the properties
            if (JSON.stringify(lastPositionDocument) === JSON.stringify(editor_config.selection.getCursor())) {
                editor_config.insert('    "' + configType + '" : [\n        {\n            "id" : "...",\n            "url" : "..."\n        }\n    ]\n}');
            } else {
                editor_config.insert('},\n\n    "' + configType + '" : [\n        {\n            "id" : "...",\n            "url" : "..."\n        }\n    ]');
            }
        }

    }
}


// function to add a resource to the editor
function addDatasource(configType) {

    // if the editor is empty, add the array brackets
    var newString = "";
    if (editor_config.getSession().getValue() === "") {
        newString += '{';
        newString += '\n    "' + configType + '" : [';
        newString += '\n        "..."';
        newString += '\n    ]';
        newString += '\n}';
        editor_config.insert(newString);
        return;
    }

    // if the editor is not empty, try to find the array holding the configType
    editor_config.moveCursorToPosition({row: 0, column: 0});
    if (editor_config.find('"' + configType + '" : [', {backwards: false}) !== undefined) {

        // get the start position
        var cursorStart = editor_config.selection.getCursor();

        // from here, find the closing tag
        if (editor_config.find(']', {backwards: false}) !== undefined) {

            // now look backwards for the last "
            if (editor_config.find('"', {backwards: true}) !== undefined) {

                // check if the found " character belongs to either an entry or to the "libraries" property
                var cursorLastEntry = editor_config.selection.getCursor();
                if ((cursorLastEntry.row < cursorStart.row) || (cursorLastEntry.row === cursorStart.row && cursorLastEntry.column < cursorStart.column)) {
                    editor_config.moveCursorToPosition({row: 0, column: 0});
                    editor_config.find('"' + configType + '" : [', {backwards: false});
                    editor_config.insert('"' + configType + '" : [\n        "..."');
                } else {
                    editor_config.insert('",\n        "..."');
                }
            }
        } else {
            alert('Invalid JSON');
        }
    } else { // a new entry for the config type needs to be added

        // find the closing bracket
        editor_config.moveCursorToPosition({row: 99999, column: 1});
        if (editor_config.find("]", {backwards: true}) !== undefined) {
            editor_config.insert('],\n\n    "' + configType + '" : [\n        "..."\n    ]');
            return;
        }


        editor_config.moveCursorToPosition({row: 99999, column: 1});
        var lastPositionDocument = editor_config.selection.getCursor();
        if (editor_config.find("}", {backwards: true}) !== undefined) {
            editor_config.findNext(); // try to find the properties
            if (JSON.stringify(lastPositionDocument) === JSON.stringify(editor_config.selection.getCursor())) {
                editor_config.insert('    "' + configType + '" : [\n        "..."\n    ]\n}');
            } else {
                editor_config.insert('},\n\n    "' + configType + '" : [\n        "..."\n    ]');
            }
        }

    }
}


/*
function addPropertyObject() {

    // if the editor is empty, add the array brackets
    var newString = "";
    if (editor_config.getSession().getValue() === "") {
        newString += '{';
        newString += '\n    "properties" : {';
        newString += '\n        "propertyName" : "propertyValue"';
        newString += '\n    }';
        newString += '\n}';
        editor_config.insert(newString);
        return;
    }

    editor_config.moveCursorToPosition({row: 0, column: 0});
    if (editor_config.find('"properties" : {', {backwards: false}) !== undefined) {

        // get the start position
        var cursorStart = editor_config.selection.getCursor();

        // from here, find the closing tag
        if (editor_config.find('}', {backwards: false}) !== undefined) {

            // now look backwards for the last "
            if (editor_config.find('"', {backwards: true}) !== undefined) {

                // check if the found " character belongs to either an entry or to the "libraries" property
                var cursorLastEntry = editor_config.selection.getCursor();
                if ((cursorLastEntry.row < cursorStart.row) || (cursorLastEntry.row === cursorStart.row && cursorLastEntry.column < cursorStart.column)) {
                    editor_config.moveCursorToPosition({row: 0, column: 0});
                    editor_config.find('"properties" : {', {backwards: false});
                    editor_config.insert('"properties" : {\n        "propertyName" : "propertyValue"');
                } else {
                    editor_config.insert('",\n        "propertyName" : "propertyValue"');
                }
            }
        } else {
            alert('Invalid JSON');
        }
    } else { // a new entry for the property needs to be added

        // find the closing bracket
        editor_config.moveCursorToPosition({row: 99999, column: 1});
        if (editor_config.find("]", {backwards: true}) !== undefined) {
            editor_config.insert('],\n\n    "properties" : {\n        "propertyName" : "propertyValue"\n    }');
            return;
        }


        editor_config.moveCursorToPosition({row: 99999, column: 1});
        var lastPositionDocument = editor_config.selection.getCursor();
        if (editor_config.find("}", {backwards: true}) !== undefined) {
            editor_config.findNext(); // try to find the properties
            if (JSON.stringify(lastPositionDocument) === JSON.stringify(editor_config.selection.getCursor())) {
                editor_config.insert('    "properties" : {\n        "propertyName" : "propertyValue"\n    }\n}');
            } else {
                editor_config.insert('},\n\n    "properties" : {\n        "propertyName" : "propertyValue"\n    }');
            }
        }

    }
}
*/